<template>
	<div class="allcontainer">
		<div class="h2">班级成员管理</div>
		<div class="bg-white">
		<div id="components-form-demo-advanced-search">
			<a-form class="ant-advanced-search-form home-form" :form="form" @submit="handleSearch">
				<a-row :gutter="24">
					<a-col :span="8">
						<a-form-item label="关键字">
							<a-input autocomplete="off" class="field-right" placeholder="请输入姓名/学号搜索"
							v-decorator="[`key`]" />
						</a-form-item>
					</a-col>
					<a-col :span="12" v-if="myinfo.isHeadMaster">
						<a-form-item label="班级" style="display: flex;align-items: center;" class="lableBox">
							<a-select :allowClear="true" v-decorator="['classID']" placeholder="全部"
								optionFilterProp="children" showSearch @change="ChangeClass">
								<a-select-option v-for="(item, index) in ClassData" :key="index" :value="item.ID">
									{{ item.Name }}/{{item.DepaerName}}
								</a-select-option>
							</a-select>
						</a-form-item>
					</a-col>
					<a-col :span="16" style="margin-top: 2px;">
						<a-button type="primary" @click="handleSearch">搜索</a-button>
						<a-button @click="handleReset">重置</a-button>
					</a-col>
				</a-row>
			</a-form>
		</div>
		<div class="table">
			<el-table stripe ref="tableList" :data="data" v-loading="loading" :max-height="tableHeight"
				highlight-current-row style="width: 100%;">
				<el-table-column type="index" label="序号" width="60" fixed="left" align="center"></el-table-column>
				<el-table-column prop="Name" label="姓名/学号" min-width="140" fixed="left" align="center">
					<template slot-scope="scope">
						<i :title="scope.row.Sex == 1 ? '男' : '女'"
							:class="{ iconfont: true, 'icon-xingbienan': scope.row.Sex == 1, 'icon-xingbienv': scope.row.Sex == 2 }"
							:style="{ color: scope.row.Sex == 1 ? 'blue' : 'red' }" @click="deleteList(scope.row)"></i>
						{{ scope.row.Name }} / {{ scope.row.UserNo }}
					</template>
				</el-table-column>
				<el-table-column prop="SumScore" :label="myInfo.ScoreName" min-width="120" align="center">
					<template slot-scope="scope">
						<a-tag :color="imgList(scope.row.SumScore).color">
						{{ imgList(scope.row.SumScore).judge }}
						</a-tag>
						<span style="margin-left:10px;">{{ scope.row.SumScore }}</span>
					</template>
				</el-table-column>
				<el-table-column prop="ClassName" label="所属班级" min-width="120" align="center"></el-table-column>
				<el-table-column prop="DepartName" label="所属部门/学院" min-width="120" align="center"></el-table-column>
				<el-table-column prop="IsEnable" label="状态" width="200" align="center">
					<template slot-scope="scope">
						<a-tag :color="scope.row.IsEnable ? 'green' : 'pink'">{{ scope.row.IsEnable ? '启用' : '停用' }}
						</a-tag>
						<!-- <a-tag :color="scope.row.IsAssistant ? 'green' : 'pink'">
							{{ scope.row.IsAssistant ? '助教' : '非助教' }}</a-tag>
						<a-tag :color="scope.row.IsLogin ? 'green' : 'pink'">{{ scope.row.IsLogin ? '已绑定' : '未绑定' }}
						</a-tag> -->
					</template>
				</el-table-column>
				<el-table-column label="操作" width="100" fixed="right">
					<template slot-scope="scope">
						<div class="user-btn user-btn-auto">
							<span class="detail" @click="seeList(scope.row,'ClassStudentDetail')">详情</span>
						</div>
					</template>
				</el-table-column>
			</el-table>
			<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
				:current-page="pagination.currentPage" :page-sizes="pagination.pageSizeOptions"
				:page-size="pagination.pageSize" layout="total, sizes, prev, pager, next, jumper"
				:total="pagination.total"></el-pagination>
		</div>
		</div>
	</div>
</template>

<script>
	import Func from '@/utils/func';
	import moment from 'moment';
	import Cache from '@/utils/cache';
	import {
		UserClassStudentDoGetPageList,
		UserCreditApplyTeacherDoGetClassList
		
	} from '@/api/follow';
	const data = [];
	export default {
		components: {},
		data() {
			return {
				data,
				form: this.$form.createForm(this, {
					name: 'advanced_search'
				}),
				ClassData: [],
				pagination: {
					currentPage: 1,
					pageSize: this.global.pageSize,
					pageSizeOptions: this.global.pageSizeOptions, // 每页中显示的数据
					showTotal: total => `共有 ${total} 条数据` // 分页中显示总的数据
				},
				addIf: false,
				text: {},
				myInfo: Cache.get('myInfo'),
				visible: false,
				confirmLoading: false,
				itemId: '',
				loading: false,
				values: {},
				pages: {
					pageIndex: 1,
					pageSize: 20
				},
				tableHeight: parseFloat(window.innerHeight - 160),
				requestUrl: this.global.requestUrl,
				token: Cache.get('token'),
				myinfo:{},
				AdoptScore:Cache.get('myInfo').AdoptScore?Cache.get('myInfo').AdoptScore:30
			};
		},
		computed: {},
		created() {
			console.log(Cache.get('myInfo'))
			this.myinfo=Cache.get('myInfo')
			this.getList();
			this.getOtherList();
		},
		mounted() {},
		methods: {
			async getOtherList() {
				let res = await UserCreditApplyTeacherDoGetClassList(data);
				this.ClassData = res.data.data;
			},
			ChangeClass(e) {
				this.classID = e;
				this.getList()
			},
			moment,
			imgList(totalScore) {
				let type = 0;
				if (totalScore < this.AdoptScore) {
					return {
						color: '#FF5050',
						judge: '不合格'
					};
				}
				if (totalScore >= this.AdoptScore) {
					return {
						color: '#3AA1FF',
						judge: '合格'
					};
				}
		
			},
			handleSearch(e) {
				e.preventDefault();
				this.form.validateFields((error, values) => {
					this.pagination.currentPage = 1;
					this.values = values;
					if (this.gradeYear) {
						this.values.grade = this.gradeYear;
					}
					this.getList();
				});
			},
			handleReset() {
				this.form.resetFields();
				this.values = {};
				this.gradeYear = null;
				this.getList();
			},
			handleSizeChange(val) {
				this.pagination.pageSize = val;
				this.getList();
			},
			handleCurrentChange(val) {
				this.pagination.currentPage = val;
				this.getList();
			},
			async getList() {
				this.loading = true;
				let data = {};
				if (this.values) {
					data = this.values;
				}
				data.pageIndex = this.pagination.currentPage;
				data.pageSize = this.pagination.pageSize;
				let res = await UserClassStudentDoGetPageList(data);
				this.loading = false;
				this.data = res.data.data;
				const pagination = {
					...this.pagination
				};
				pagination.total = res.data.pageInfo.TotalItemCount;
				this.pagination = pagination;
				this.$refs.tableList.bodyWrapper.scrollTop = 0;
			},
			seeList(text, name) {
				this.$router.push({
					name: name,
					query: {
						ID: text.ID,
						Name: text.Name,
						UserNo: text.UserNo
					}
				});
			},
			closeFun() {
				this.addIf = false;
				this.getList();
			}
		}
	};
</script>

